<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>用户管理</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <link rel="icon" type="image/png" href="/resources/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="/resources/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <script src="/resources/js/echarts.min.js"></script>
    <link rel="stylesheet" href="/resources/css/amazeui.min.css"/>
    <link rel="stylesheet" href="/resources/css/amazeui.datatables.min.css"/>
    <link rel="stylesheet" href=/resources/css/amazeui.chosen.css"/>
    <link rel="stylesheet" href="/resources/css/app.css">
    <script src="/resources/js/jquery.min.js"></script>
    <script src="/resources/js/amazeui.chosen.min.js"></script>
    <script src="/resources/jsutlis/DateFormat.js"></script>
</head>

<body data-type="widgets">
<script src="/resources/js/theme.js"></script>
<div class="am-g tpl-g">

    <%--头部开始--%>
    <%@include file="header.jsp" %>
    <%--头部结束--%>

    <!-- 内容区域 -->
    <div class="tpl-content-wrapper">
        <div class="row-content am-cf">
            <div class="row">
                <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                    <div class="widget am-cf">
                        <%-- 消息 --%>
                        <div class="container-fluid am-cf">
                            <div class="row">
                                <div class="am-u-sm-12 am-u-md-12 am-u-lg-9">
                                    <div class="page-header-heading"><span
                                            class="am-icon-smile-o page-header-heading-icon"></span> 用户管理
                                        <small>User management</small>
                                    </div>
                                    <p class="page-header-description">对用户信息进行增加、修改等操作。</p>
                                </div>
                                <div class="am-u-lg-3 tpl-index-settings-button">
                                    <%--<button type="button" class="page-header-button"><span class="am-icon-paint-brush"></span> 设置</button>--%>
                                </div>
                            </div>
                        </div>
                        <%-- 表格 --%>
                        <div class="widget-body  am-fr">
                            <div class="am-u-sm-12 am-u-md-6 am-u-lg-6">
                                <div class="am-form-group">
                                    <div class="am-btn-toolbar">
                                        <div class="am-btn-group am-btn-group-xs">
                                            <button type="button" class="am-btn am-btn-default am-btn-success"
                                                    onclick="hideBtn()"
                                                    data-am-modal="{target: '#addModel', width: 900}"><span
                                                    class="am-icon-plus"></span> 添加用户
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <!-- 右上角搜索框 -->
                            <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
                                <div class="am-form-group tpl-table-list-select">
                                    <select id="searchType" data-am-selected="{btnSize: 'sm'}">
                                        <option value="userName">用户名</option>
                                    </select>
                                </div>
                            </div>
                            <div class="am-u-sm-12 am-u-md-12 am-u-lg-3">
                                <div class="am-input-group am-input-group-sm tpl-form-border-form cl-p">
                                    <input type="text" class="am-form-field" id="searchContent">
                                    <span class="am-input-group-btn">
                                            <button class="am-btn am-btn-default am-btn-success tpl-table-list-field am-icon-search"
                                                    id="searchBtn" type="button"></button>
                                        </span>
                                </div>
                            </div>

                            <!-- 用户表开始 -->
                            <div class="am-u-sm-12 tableDiv">
                                <table width="100%" class="am-table am-table-compact am-table-striped tpl-table-black">
                                    <thead>
                                    <tr>

                                        <th class="am-text-center">头像</th>
                                        <th class="am-text-center">用户名</th>
                                        <th class="am-text-center">用户身份</th>
                                        <th class="am-text-center">性别</th>
                                        <th class="am-text-center">年龄</th>
                                        <th class="am-text-center">婚姻状况</th>
                                        <th class="am-text-center">电话号码</th>
                                        <th class="am-text-center">邮箱</th>
                                    </tr>
                                    </thead>
                                    <tbody class="am-text-center">
                                    <c:forEach items="${pageInfo.list }" var="u">
                                        <tr>

                                            <td><a href="#" onclick="showPhotoFun('${u.id}');"
                                                   data-am-modal="{target: '#showPictureModel', closeViaDimmer: 0, width: '400px', height: '500px'}">头像</a>
                                            </td>
                                            <td>${u.userName}</td>
                                            <td>
                                                    ${u.cateName}</td>
                                            <td>
                                                <c:choose>
                                                    <c:when test="${u.userSex == 1}">男</c:when>
                                                    <c:when test="${u.userSex == 0}">女</c:when>
                                                </c:choose>
                                            </td>
                                            <td>${u.userAge }岁</td>
                                            <td>
                                                <c:choose>
                                                    <c:when test="${u.marriage == 1}">未婚</c:when>
                                                    <c:when test="${u.marriage == 2}">已婚</c:when>
                                                    <c:when test="${u.marriage == 3}">离异</c:when>
                                                </c:choose>
                                            </td>
                                            <td> ${u.userTel}</td>
                                            <td> ${u.userMail} </td>
                                                <%--<td>${u.vipId}</td>--%>
                                                <%--<td> ${u.babyId} </td>--%>
                                            <td>
                                                <button type="button" class="am-btn am-btn-xs am-btn-secondary"
                                                        onclick="userRecharge('${u.id}')">充值
                                                </button>
                                                <button type="button" class="am-btn am-btn-xs am-btn-secondary"
                                                        onclick="checkVipInfo('${u.id}')"
                                                        data-am-modal="{target:'#formModel', width:900}">查看会员信息
                                                </button>
                                                <button type="button" class="am-btn am-btn-xs am-btn-secondary"
                                                        onclick="editEmpFun('${u.id}')"
                                                        data-am-modal="{target: '#addModel', width: 900}">
                                                    <span class="am-icon-pencil"></span> 查看
                                                </button>
                                                <%--<button type="button" class="am-btn am-btn-xs am-btn-danger"--%>
                                                        <%--onclick="delEmpFun('${u.id}')"&lt;%&ndash;data-am-modal="{target: '#delEmpConfirm'}"&ndash;%&gt;>--%>
                                                    <%--<span class="am-icon-trash"></span> 删除--%>
                                                <%--</button>--%>
                                                <c:if test="${u.state == 0}">
                                                    <button type="button" class="am-btn am-btn-xs am-btn-danger"
                                                            onclick="changeActive('${u.id}')"<%--data-am-modal="{target: '#delEmpConfirm'}"--%>>
                                                        <span class="am-icon-trash"></span> 点击激活
                                                    </button>
                                                </c:if>

                                            </td>
                                        </tr>
                                    </c:forEach>
                                    <!-- more data -->
                                    </tbody>
                                </table>
                            </div>
                            <!-- 用户表结束 -->

                            <!-- 分页开始 -->
                            <div class="am-u-lg-12 am-cf pageInfoTotal">

                                <!-- 分页文字信息，其中分页信息都封装在pageInfo中 -->
                                <div class="col-md-6 ">
                                    当前第：${pageInfo.pageNum }页，总共：${pageInfo.pages }页，总共：${pageInfo.total }条记录
                                </div>
                                <div class="am-fr">
                                    <ul class="am-pagination tpl-pagination">
                                        <!-- 首页 -->
                                        <li><a href="/userInfoController/findUserInfo?pn=1">首页</a></li>
                                        <!-- 上一页 -->
                                        <c:if test="${pageInfo.hasPreviousPage }">
                                            <li>
                                                <a href="/userInfoController/findUserInfo?pn=${pageInfo.pageNum-1 }"
                                                   aria-label="Previous">
                                                    <span aria-hidden="true">&laquo;</span>
                                                </a>
                                            </li>
                                        </c:if>
                                        <!-- 循环遍历连续显示的页面，若是当前页就高亮显示，并且没有链接 -->
                                        <c:forEach items="${pageInfo.navigatepageNums }" var="page_Num">
                                            <c:if test="${page_Num == pageInfo.pageNum }">
                                                <li class="am-active"><a
                                                        href="/userInfoController/findUserInfo?pn=${page_Num }">${page_Num }</a>
                                                </li>
                                            </c:if>
                                            <c:if test="${page_Num != pageInfo.pageNum }">
                                                <li>
                                                    <a href="/userInfoController/findUserInfo?pn=${page_Num }">${page_Num }</a>
                                                </li>
                                            </c:if>
                                        </c:forEach>
                                        <!-- 下一页 -->
                                        <c:if test="${pageInfo.hasNextPage }">
                                            <li>
                                                <a href="/userInfoController/findUserInfo?pn=${pageInfo.pageNum+1 }"
                                                   aria-label="Next">
                                                    <span aria-hidden="true">&raquo;</span>
                                                </a>
                                            </li>
                                        </c:if>
                                        <!-- 末页 -->
                                        <li><a href="/userInfoController/findUserInfo?pn=${pageInfo.pages }">末页</a></li>
                                    </ul>
                                </div>
                            </div>
                            <!-- 分页结束 -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 添加用户模态框开始 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="addModel">
        <div class="am-modal-dialog">
            <div class="am-modal-bd" style="padding: 2px;">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf" style="margin: 0;">
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl"><h2>用户表单</h2></div>
                                <div class="widget-function am-fr">
                                    <a href="javascript: void(0)" class="am-close am-close-spin clearForm"
                                       data-am-modal-close>&times;</a>
                                </div>
                            </div>
                            <div class="widget-body am-fr">
                                <form class="am-form tpl-form-border-form tpl-form-border-br" id="addUserForm">

                                    <!-- 数据库主键(隐藏) -->
                                    <div class="am-form-group am-hide">
                                        <label class="am-u-sm-3 am-form-label">userNo</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="id" class="am-form-field tpl-form-no-bg Id">
                                            <input type="text" name="userId"
                                                   class="am-form-field tpl-form-no-bg userId">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small>不可编辑！</small>
                                        </div>
                                    </div>

                                    <!-- 会员、学员 -->
                                    <%--  <div class="am-form-group">
                                          <label class="am-u-sm-3 am-form-label">用户身份</label>
                                          <div class="am-u-sm-6">
                                              <div class="am-form-group">
                                                  <label class="am-radio-inline">
                                                      <input class="reserve1" type="radio" name="reserve1" value="0"
                                                             checked="checked"> 会员
                                                  </label>
                                                  <label class="am-radio-inline">
                                                      <input class="reserve1" type="radio" name="reserve1" value="1"
                                                             onchange=""> 学员
                                                  </label>
                                              </div>
                                          </div>
                                          <div class="am-u-sm-3">
                                              <small style="color: green"></small>
                                          </div>
                                      </div>--%>
                                    <!-- 头像 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">头像</label>
                                        <div class="am-u-sm-6">
                                            <div class="tpl-form-file-img">
                                                <img class="imagePhoto" style="width: 180px; height: 230px;" id="viewImage">
                                            </div>
                                            <br>
                                            <div class="am-form-group am-form-file">
                                                <button type="button" class="am-btn am-btn-danger am-btn-sm">
                                                    <i class="am-icon-cloud-upload"></i> 上传用户头像
                                                </button>
                                                <input type="file" class="addEmPhoto">
                                                <input type="text" name="userPhoto" class="am-hide strPhoto">
                                            </div>
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipuserPhoto">请上传头像！</small>
                                        </div>
                                    </div>

                                    <!-- 姓名 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">用户名</label>
                                        <div class="am-u-sm-6">
                                            <input maxlength="18" type="text" name="userName"
                                                   class="tpl-form-input userName"
                                                   placeholder="请输入用户名(英文+数字)">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tiploginName">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 密码 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">密码</label>
                                        <div class="am-u-sm-6">
                                            <input type="password" name="password"
                                                   class="am-form-field tpl-form-no-bg password"
                                                   placeholder="密码为6-16位！">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tippassword">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 确认密码 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">确认密码</label>
                                        <div class="am-u-sm-6">
                                            <input type="password" name="password2"
                                                   class="am-form-field tpl-form-no-bg password2"
                                                   placeholder="确认密码为6-16位！">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tippassword2">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 性别 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">性别</label>
                                        <div class="am-u-sm-6">
                                            <div class="am-form-group">
                                                <label class="am-radio-inline">
                                                    <input class="userSex" type="radio" name="userSex" value="1"
                                                           checked="checked"> 男
                                                </label>
                                                <label class="am-radio-inline">
                                                    <input class="userSex" type="radio" name="userSex" value="0"> 女
                                                </label>
                                            </div>
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small style="color: green"></small>
                                        </div>
                                    </div>

                                    <!-- 年龄 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">年龄</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="userAge" class="tpl-form-input userAge"
                                                   placeholder="请输入年龄">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipemage">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 婚姻状态 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">婚姻状态</label>
                                        <div class="am-u-sm-6">
                                            <div class="am-form-group">
                                                <label class="am-radio-inline">
                                                    <input class="marriage" type="radio" name="marriage" value="1"
                                                           checked="checked"> 未婚
                                                </label>
                                                <label class="am-radio-inline">
                                                    <input class="marriage" type="radio" name="marriage" value="2"> 已婚
                                                </label>
                                                <label class="am-radio-inline">
                                                    <input class="marriage" type="radio" name="marriage" value="3"> 离异
                                                </label>
                                            </div>
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small style="color: green"></small>
                                        </div>
                                    </div>

                                    <!-- 电话号码 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">电话</label>
                                        <div class="am-u-sm-6">
                                            <input maxlength="11" type="text" name="userTel"
                                                   class="am-form-field tpl-form-no-bg userTel"
                                                   placeholder="请输入电话">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipemTel">必填项！</small>
                                        </div>
                                    </div>

                                    <!--  邮箱 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">邮箱</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="userMail"
                                                   class="am-form-field tpl-form-no-bg loginName userMail"
                                                   placeholder="用户邮箱">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipUserMail">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 会员卡号 -->
                                    <div class="am-form-group" id="typeVIP">
                                        <label class="am-u-sm-3 am-form-label">会员卡类型</label>
                                        <div class="am-u-sm-6">
                                            <select id="vipId" name="vipId" data-am-selected>
                                                <option></option>
                                                <c:forEach items="${vipCards}" var="vc">
                                                    <option value="${vc.vipId}">${vc.vipName}</option>
                                                </c:forEach>
                                            </select>

                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="typevip">必选项！</small>
                                        </div>
                                    </div>

                                    <!-- 会员卡号 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">会员卡号</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="vipNo"
                                                   class="am-form-field tpl-form-no-bg vipId"
                                                   placeholder="请输入会员卡号">
                                            <input type="hidden" name="vipId" class="vipNo">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipvipId">必填项！</small>
                                        </div>
                                    </div>

                                    <!-- 地址 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">地址</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="userAddress"
                                                   class="am-form-field tpl-form-no-bg userAddress"
                                                   placeholder="请输入用户住址">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipemAddress"></small>
                                        </div>
                                    </div>

                                    <!-- 宝宝 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">宝宝编号</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="fileNo"
                                                   class="am-form-field tpl-form-no-bg babyId" placeholder="请输入宝宝编号">
                                            <input type="hidden" name="babyId" class="fileNo">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipbabyId">必填项！</small>
                                        </div>
                                    </div>
                                    <!-- 宝宝 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">与宝宝关系</label>
                                        <div class="am-u-sm-6">
                                            <input maxlength="10" type="text" name="reserve2"
                                                   class="am-form-field tpl-form-no-bg reserve2"
                                                   placeholder="请输入用户与宝宝关系，如：母亲、父亲、祖母等..">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small class="tipreserve2"></small>
                                        </div>
                                    </div>

                                    <!-- 按钮 -->
                                    <div class="am-form-group">
                                        <div class="am-u-sm-12">
                                            <button type="button"
                                                    class="am-btn am-btn-primary tpl-btn-bg-color-success  clearForm"
                                                    data-am-modal-close=""><i class="am-icon-close"></i> 关闭
                                            </button>
                                            <%--<button type="button" class="am-btn am-btn-success tpl-btn-bg-color-success"--%>
                                                    <%--id="updateUserBtn"--%>
                                                    <%--onclick="updateUserFun();"><i class="am-icon-floppy-o"></i> 更新--%>
                                            <%--</button>--%>
                                            <button type="button" class="am-btn am-btn-success tpl-btn-bg-color-success"
                                                    id="submitAddUserBtn"><i class="am-icon-floppy-o"></i> 提交
                                            </button>
                                        </div>
                                    </div>

                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 整个表单结束 -->
            </div>
        </div>
    </div>
    <!-- 添加用户模态框结束 -->

    <!-- 查看头像模态框开始 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="showPictureModel">
        <div class="am-modal-dialog">
            <div class="am-modal-hd">
                用户头像
                <a href="javascript: void(0)" class="am-close am-close-spin clearForm" data-am-modal-close>&times;</a>
            </div>
            <div class="am-modal-bd">
                <div class="tpl-form-file-img">
                    <img class="imagePhoto" alt="未找到头像" width="380px" height="440px">
                </div>
            </div>
        </div>
    </div>
    <!-- 查看头像模态框结束 -->


    <div class="am-modal am-modal-no-btn" tabindex="-1" id="rechargeModel">
        <div class="am-modal-dialog">
            <div class="am-modal-hd widget-head am-cf">
                <div class="widget-title am-fl"><h2>充值</h2></div>
                <div class="widget-function am-fr">
                    <a href="javascript: void(0)" class="am-close am-close-spin clearForm"
                       data-am-modal-close>&times;</a>
                </div>
            </div>
            <div class="am-modal-bd">
                <div class="am-u-md-12 am-u-lg-12">
                    <label class="am-u-sm-12 am-u-md-3 am-form-label"
                           style="text-align: center; color: red;">充值金额/元</label>
                    <div class="am-u-sm-12 am-u-md-7" id="recharge-msg">
                        <input type="hidden" id="recharge-userid"/>
                        <input type="text" name="recharge" id="recharge"
                               class="am-form-field tpl-form-no-bg recharge" maxlength="6"/>
                    </div>

                    <div class="am-u-sm-12 am-u-md-12" style="margin:20px; ">
                        <button type="button" class="am-btn am-btn-success tpl-btn-bg-color-success"
                                id="rechargeSubmitBtn"> 确认充值
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>







    <!-- 删除用户信息提示警告框开始 -->
    <div class="am-modal am-modal-confirm" tabindex="-1" id="delEmpConfirm">
        <div class="am-modal-dialog">
            <div class="am-modal-hd">删除警告</div>
            <div class="am-modal-bd">
                您，确定要删除这条记录吗？
            </div>
            <div class="am-modal-footer">
                <span class="am-modal-btn" data-am-modal-cancel>取消</span>
                <span class="am-modal-btn" data-am-modal-confirm>确定</span>
            </div>
        </div>
    </div>
    <!-- 删除用户信息提示警告框结束 -->

    <!-- 查看会员信息模态框开始 -->
    <div class="am-modal am-modal-no-btn" tabindex="-1" id="formModel">
        <div class="am-modal-dialog">
            <div class="am-modal-bd" style="padding: 2px;">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf" style="margin: 0;">
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl"><h2>会员信息查看</h2></div>
                                <div class="widget-function am-fr">
                                    <a href="javascript: void(0)" class="am-close am-close-spin clearForm"
                                       data-am-modal-close>&times;</a>
                                </div>
                            </div>
                            <div class="widget-body am-fr">
                                <form class="am-form tpl-form-border-form tpl-form-border-br" id="VIPForm">

                                    <!-- 数据库主键(隐藏) -->
                                    <div class="am-form-group am-hide">
                                        <label class="am-u-sm-3 am-form-label">userId</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="id" class="am-form-field tpl-form-no-bg Id">
                                            <input type="text" name="userId"
                                                   class="am-form-field tpl-form-no-bg userId">
                                        </div>
                                        <div class="am-u-sm-3">
                                            <small>不可编辑！</small>
                                        </div>
                                    </div>

                                    <!-- 会员、学员 -->
                                    <%--  <div class="am-form-group">
                                          <label class="am-u-sm-3 am-form-label">用户身份</label>
                                          <div class="am-u-sm-6">
                                              <div class="am-form-group">
                                                  <label class="am-radio-inline">
                                                      <input class="reserve1" type="radio" name="reserve1" value="0"
                                                             checked="checked"> 会员
                                                  </label>
                                                  <label class="am-radio-inline">
                                                      <input class="reserve1" type="radio" name="reserve1" value="1"
                                                             onchange=""> 学员
                                                  </label>
                                              </div>
                                          </div>
                                          <div class="am-u-sm-3">
                                              <small style="color: green"></small>
                                          </div>
                                      </div>--%>

                                    <!-- 姓名 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">用户名</label>
                                        <div class="am-u-sm-6">
                                            <input maxlength="18" type="text" name="userName"
                                                   class="tpl-form-input userName"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 会员编号 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">会员编号</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="vipNo"
                                                   class="am-form-field tpl-form-no-bg vipNo"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 会员等级 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">会员等级</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="vipCategory"
                                                   class="am-form-field tpl-form-no-bg vipCategory"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 余额 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">余额</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="balance"
                                                   class="am-form-field tpl-form-no-bg balance"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 会员卡图片 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">会员卡图片</label>
                                        <div class="am-u-sm-6">
                                            <div class="tpl-form-file-img">
                                                <img class="imagePhoto" style="width: 180px; height: 230px;">
                                            </div>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 所属分店 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">所属分店</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="branname"
                                                   class="am-form-field tpl-form-no-bg branname"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 最近充值时间 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">最近充值时间</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="chargeDtae"
                                                   class="am-form-field tpl-form-no-bg chargeDtae"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 剩余消费次数 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">剩余消费次数</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="remainTime"
                                                   class="am-form-field tpl-form-no-bg remainTime"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 是否激活 -->
                                    <div class="am-form-group">
                                        <label class="am-u-sm-3 am-form-label">是否激活</label>
                                        <div class="am-u-sm-6">
                                            <input type="text" name="state"
                                                   class="am-form-field tpl-form-no-bg state"
                                                   placeholder="" readonly>
                                        </div>
                                        <div class="am-u-sm-3">
                                        </div>
                                    </div>

                                    <!-- 按钮 -->
                                    <div class="am-form-group">
                                        <div class="am-u-sm-12">
                                            <button type="button"
                                                    class="am-btn am-btn-primary tpl-btn-bg-color-success  clearForm"
                                                    data-am-modal-close=""><i class="am-icon-close"></i> 关闭
                                            </button>
                                        </div>
                                    </div>

                                </form>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 整个表单结束 -->
            </div>
        </div>
    </div>
    <!-- 查看会员信息模态框结束 -->

</div>

<script src="/resources/js/amazeui.min.js"></script>
<script src="/resources/js/amazeui.datatables.min.js"></script>
<script src="/resources/js/dataTables.responsive.min.js"></script>
<script src="/resources/js/app.js"></script>
<script src="/resources/jsutlis/fileutli.js"></script>
<script src="/resources/js/userinfo.form.validation.js"></script>
<script>
    $('.reserve1').change(function () {
        var vips = $('#vipId');
        var divtypeVIP = $('typeVIP');
        if (this.value == '1') {
            vips.attr("name", 'vipId');
            divtypeVIP.show();
            alert("学员");
        }
        else if (this.value == '0') {
            vips.attr("name", 'sbbsbsb');
            divtypeVIP.hidden();
            alert("会员");
        }
    });

    function userRecharge(uid) {
        $('#recharge-userid').val(uid);
        var formdata = new FormData();
        formdata.append("userId", uid);
        $.ajax({
            url: "/vipInfoController/findOneVipInfo",
            type: 'POST',
            cache: false,
            data: formdata,
            async: false,
            processData: false,
            contentType: false
        }).done(function (res) {
            if (res.vipinf === null || res.vipinf === undefined || res.vipinf === '' || res.vipinf.length === 0) {
                alert("该用户不是会员！");
                return false;
            }else {
                if (res.vipinf.vipLevel == 0){
                    var ss =' <label class="am-u-sm-12 am-u-md-3 am-form-label" id="count-msg" style="text-align: center; color: red;">充值次数' +
                        '</label><div class="am-u-sm-12 am-u-md-7"><input type="text" name="recharge" id="rechargecount"' +
                        ' class="am-form-field tpl-form-no-bg recharge" maxlength="6"/></div>';
                    $('#recharge-msg').after(ss);
                }else {
                    var countmsg = $('#count-msg').val();
                    if (countmsg != null && countmsg != undefined) {
                        countmsg.remove();
                        $('#rechargecount').remove();
                    }
                }
            }
            $('#rechargeModel').modal({target: '#rechargeModel'});
        });
    }






    $("#rechargeSubmitBtn").click(function () {
        var recharge = $("#recharge").val();
        var reg = /^[0-9]*$/;
        var formdata = new FormData();
        if (!reg.test(recharge)) {
            alert("请输入正确的充值金额（数字）");
            return false;
        }
        var countmsg =$('#count-msg').val();
        console.log(countmsg);
        if (countmsg != null && countmsg != undefined) {
            var rechage = $("#rechargecount");
            console.log(rechage);
            if (rechage != null && rechage != undefined && rechage != '') {
                var cc = rechage.val();
                if (!reg.test(cc)) {
                    alert("请输入正确的体验次数（数字）");
                    return false;
                }
                formdata.append("remainTime", cc);
            }
        }

        formdata.append("sumCharge", recharge);
        formdata.append("userId", $('#recharge-userid').val());
        var URL = '/vipInfoController/userrecharge';
        $.ajax({
            url: URL,
            type: 'POST',
            data: formdata,
            cache: false,
            async: false,
            processData: false,
            contentType: false
        }).done(function (res) {
            console.log(res);
            if (res.success) {
                $("#recharge").val('')
                $('#recharge-userid').val('');
                alert("充值成功");
            } else {
                alert(res.msg);
            }
        }).fail(function (res) {
            console.log(res);
            alert("网络错误");
            //  return res;
        });
        $("#rechargeModel").modal('close');
    });

    function checkVipInfo(uid) {
        var formdata = new FormData();
        formdata.append("userId", uid);
        var userData = new FormData();
        userData.append("id", uid);
        $.ajax({
            url: "/userInfoController/findOneUser",
            type: 'POST',
            cache: false,
            data: userData,
            async: false,
            processData: false,
            contentType: false
        }).done(function (obj) {
            $(".userName").val(obj.userp.userName);
        });
        $.ajax({
            url: "/vipInfoController/findOneVipInfo",
            type: 'POST',
            cache: false,
            data: formdata,
            async: false,
            processData: false,
            contentType: false
        }).done(function (res) {
            console.log(res);
            if (res.vipinf === null || res.vipinf === undefined || res.vipinf === '' || res.vipinf.length === 0) {
                alert("该用户不是会员！");
                return false;
            }
            var vipIdForm = new FormData();
            vipIdForm.append("vipId", res.vipinf.vipId);
            $(".vipNo").val(res.vipinf.vipNo);
            $.ajax({
                url: "/vipCardController/findOneVipCard",
                type: 'POST',
                cache: false,
                data: vipIdForm,
                async: false,
                processData: false,
                contentType: false
            }).done(function (data) {
                console.log(data);
                $(".vipCategory").val(data.vip.vipName);
                if (data.vip.vipLevel == 0 ) {
                    $(".remainTime").val(res.vipinf.remainTime);
                }
            });
            $(".balance").val(res.vipinf.balance);
            var chargeTime = res.vipinf.chargeDtae;
            $(".chargeDtae").val(formatDate(chargeTime));
            if (res.vipinf.state == 0) {
                $(".state").val("未激活");
            } else if (res.vipinf.state == 1) {
                $(".state").val("已激活")
            }

            var branchesId = new FormData();
            branchesId.append("branId", res.vipinf.branId);
            $.ajax({
                url: "/branchesController/findOneBranches",
                type: 'POST',
                cache: false,
                data: branchesId,
                async: false,
                processData: false,
                contentType: false
            }).done(function (oneBran) {
                $(".branname").val(oneBran.bran.branName);
            });


        });
    }

    function timestampToTime(timestamp) {
        var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
        Y = date.getFullYear() + '-';
        M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
        D = date.getDate() + ' ';
        h = date.getHours() + ':';
        m = date.getMinutes() + ':';
        s = date.getSeconds();
        return Y + M + D + h + m + s;
    }
</script>
</body>

</html>